const path = require('path')
const webpack = require('webpack')
//使用vue-loader 一定要使用下面的插件
const vueLoaderPluin = require('vue-loader/lib/plugin')
//倒入内存中生成的html页面的插件，只要是插件就放到plugins中
const htmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
    entry: path.join(__dirname, './src/main.js'),
    output: {
        path: path.join(__dirname, './dist'),
        filename: 'bundle.js'
    },
    // devServer:{//如果package没有添加--open --hot就添加这个
    //     open:true,//自动打开浏览器
    //     port:8000, 
    //     contentBase:'src',
    //     hot:true//启动热更新的第一步
    // },
    // plugins:[//配置插件的节点
    //     new webpack.HotModuleReplacementPlugin()//new一个热更新的模块对象
    // ]
    plugins: [
        new htmlWebpackPlugin({//创建一个生成html的插件
            template: path.join(__dirname, './src/index.html'),//制定模板，来会根据这个庐陵
            filename: 'index.html'//会打开的文件名
        }),
        new vueLoaderPluin() 
    ],
    module: {//这个节点是所有第三放加载器
        rules: [//所有第三方匹配规则
            {
                test: /\.css$/, //匹配css文件
                use: ['style-loader', 'css-loader']//调用顺序从右到左
            },
            {
                test: /\.less$/,//定义less规则
                use: ['style-loader', 'css-loader', 'less-loader']
            },
            {
                test: /\.jpg|png|gif|jpeg$/,
                use: 'url-loader?limit=7112'//如果图片的大小大于给定的limit则不会转为base64格式，相反会
            },
            {
                test: /\.ttf|svg|eot|woff|woff2/,//匹配字体图标
                use: 'url-loader'
            },
            { test: /\.js$/, use: 'babel-loader', exclude: /node_modules/ },
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            }
        ]
    },
    performance:{
        hints:false
    }
    // resolve: {
    //     alias: {//修改vue被倒入时候包的路径
    //         //'vue$':'vue/dist/vue.js'
    //     }
    // }
}